import React,{Component} from 'react';
import {Platform, StyleSheet,ScrollView,Text, View,TouchableOpacity, Alert,Image, TextInput } from 'react-native';
import DatePicker from 'react-native-datepicker';

export default class attendance extends Component{
    static navigationOptions = {
        headerStyle:{
            backgroundColor:'#d04542',
            height:50,
        },
        headerTintColor:'white',
    };
	constructor(props){
    	super(props)
    	this.state = {
    		datetime: '', //用来存取时间的
    	}
    }
	render(){
		return(
		    <ScrollView style={styles.ScrollView}>
		        <View style={styles.container}>
		        	<View style={styles.inputs}>
		        		<Text style={styles.title}>医院名称:</Text>
		        		<TextInput style={styles.inputa} />
		        	</View>
		        	<View style={styles.inputs}>
		        		<Text style={styles.title}>医院科室:</Text>
		        		<TextInput style={styles.inputa} />
		        	</View>
		        	<View style={styles.inputs}>
		        		<Text style={styles.title}>入住时间:{this.state.datetime}</Text>
		        		<DatePicker style={styles.data} date={this.state.datetime}
				          mode="datetime" format="YYYY-MM-DD HH:mm"
				          confirmBtnText="确定"  cancelBtnText="取消"
				          customStyles={{
				          	dateIcon: {left: 0,top: 4,marginLeft: 0},
				          	dateInput: {borderWidth:0,marginTop:10,marginLeft:-50,}
					      }}
				          onDateChange={(datetime) => {this.setState({datetime: datetime});}}
				        />
		        	</View>
		        	<View style={styles.inputs}>
		        		<Text style={styles.title}>出院时间:{this.state.datetime}</Text>
		        		<DatePicker style={styles.data} date={this.state.datetime}
				          mode="datetime" format="YYYY-MM-DD HH:mm"
				          confirmBtnText="确定"  cancelBtnText="取消"
				          customStyles={{
				          	dateIcon: {left: 0,top: 4,marginLeft: 0},
				          	dateInput: {borderWidth:0,marginTop:10,marginLeft:-50,}
					      }}
				          onDateChange={(datetime) => {this.setState({datetime: datetime});}}
				        />
		        	</View>
		    	</View>
		    	<View style={{padding:10}}>
			        <TouchableOpacity style={{height:40}}>
			      		<Text style={styles.btn}>提交</Text>
			    	</TouchableOpacity>
		    	</View>
         	</ScrollView>
		);
	}
}
const styles = StyleSheet.create({
	data:{
		flex:5
	},
	btn:{
		width:"100%",backgroundColor:'#D04542',borderRadius:2,
	  	lineHeight: 40 ,color: 'white',textAlign: 'center',
	},
	imageStyle:{
        height:20, width:20,
	},
	title:{
		flex:2,fontSize: 17,lineHeight: 50,fontWeight:"400",textAlign: 'center',
	},
	inputa:{
		flex:5,fontSize: 17,
	},
	inputs:{
		height:50,flexDirection: 'row',borderBottomWidth:1,borderBottomColor: "#D4D4D4"
	},
	container:{
		margin:10,backgroundColor: 'white'
	},
});



				        
